<template>
	<view class="qrCode">
		<uqrcode ref="uqrcode" canvas-id="qrcode" :value="url" @click="setAuth" :options="{ margin: 10 }" style="margin: auto;padding-top: 60rpx" :size="200">
		</uqrcode>
	</view>
</template>

<script>
	import UQRCode from 'uqrcodejs'
	import Config from '@/core/config'
	export default {
	  components: {
	  },
	  data() {
	    return {
			url: ''
		}
	  },
	  /**
	   * 生命周期函数--监听页面显示
	   */
	  onShow(options) {
	    // 后端api地址
	    const apiUrl = Config.get('apiUrl')
	    this.url = apiUrl + '/wechat/getAuthUrl&refereeId='+ uni.getStorageSync('userId')
	   
	  },
	  mounted() {
	  	 this.initUQRCode() //生成二维码
	  },
	  methods: {
		  //  生成二维码
		  initUQRCode: function(){
			  const apiUrl = Config.get('apiUrl')
			  // 获取uQRCode实例
			  var qr = new UQRCode();
			  // 设置二维码内容
			  qr.data = apiUrl + "wechat/getAuthUrl&refereeId="+ uni.getStorageSync('userId');
			  // 设置二维码大小，必须与canvas设置的宽高一致
			  qr.size = 100;
			  // 调用制作二维码方法
			  qr.make();
			  // 获取canvas上下文
			  var canvasContext = uni.createCanvasContext('qrcode', this); // 如果是组件，this必须传入
			  // 设置uQRCode实例的canvas上下文
			  qr.canvasContext = canvasContext;
			  // 调用绘制方法将二维码图案绘制到canvas上
			  qr.drawCanvas();
			  console.log('qr',qr)
		  },
		  //点击保存
		setAuth() {
			const qrcode = uni.createSelectorQuery().select('#qrcode');
			this.$refs.uqrcode.toTempFilePath({
				success: res => {
					console.log(111, res);
					const aEle = document.createElement('a');
					aEle.download = 'uQRCode'; // 设置下载的文件名，默认是'下载'
					aEle.href = res.tempFilePath;
					document.body.appendChild(aEle);
					aEle.click();
					aEle.remove(); // 下载之后把创建的元素删除
					// this.$refs.uqrcode.save({
					// 	success: () => {
							// uni.showToast({
							// 	title: '保存成功！',
							// 	icon: 'success'
							// });
					// 	},
					// 	fail: err => {
					// 		uni.showToast({
					// 			title: '保存失败！',
					// 			icon: 'error'
					// 		});
					// 	}
					// })
				},
				fail: err => {
					uni.showToast({
						title: '保存失败！',
						icon: 'error'
					});
				}
			});
		 //    qrcode.fields({ size: true }, res => {
			// // const context = uni.createCanvasContext('qrcode', this);
			// // context.drawImage('', 0, 0, res.width, res.height);
			// // context.draw();
	  //       // uni.getSetting({
			// // 	success: res => {
			// // 		console.log('res',res)
			// // 	}
			// // })
			// // 导出图片到系统相册
			// uni.getSystemInfo({
			//   success: (info) => {
			// 	  // * (info.windowWidth / 750)
			// 	let width = res.width;
			// 	let height = res.height;
			// 	 console.log('resresres', info)
			// 	uni.canvasToTempFilePath({
			// 	  canvasId: 'qrcode',
			// 	  destWidth: width,
			// 	  destHeight: height,
			// 	  success: (res) => {
			// 		console.log('resresres', res)
			// 		uni.saveImageToPhotosAlbum({
			// 		  filePath: res.tempFilePath,
			// 		  success: () => {
			// 			uni.showToast({
			// 			  title: '保存成功',
			// 			  icon: 'success',
			// 			  duration: 2000
			// 			});
			// 		  },
			// 		  fail: () => {
			// 			uni.showToast({
			// 			  title: '保存失败，请检查权限',
			// 			  icon: 'none',
			// 			  duration: 2000
			// 			});
			// 		  }
			// 		});
			// 	  },
			// 	  fail: (err) => {
			// 		console.log('导出失败', err);
			// 	  }
			// 	}, this);
			//   }
			// });
		 //  }).exec();
		},
	  }
	}
</script>

<style>
</style>